<template>
  <div class="outer-box">
    <div class="inner-box">
      <div>{{ title }}</div>
      <div class="img-box">
        <img v-for="item in imageList" :key="item" :src="item" />
      </div>
    </div>
  </div>
</template>

<script>
export default {
  props: ["imageList", "title"],
};
</script>

<style scoped>
.outer-box {
  padding: 0 20px;
}
.inner-box {
  padding: 10px 0;
  border-bottom: 1px dashed #333;
}
.img-box {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
}
img {
  display: block;
  width: 100%;
}
</style>